<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>echarts</title>
	<script src="http://apps.bdimg.com/libs/jquery/1.11.3/jquery.js"></script>
	<script src="echarts.common.min.js"></script>
	<script src="essos.js"></script>
</head>
<body>
	<div id="main" style="width: 600px;height:400px;"></div>
	<script>
		var myChart = echarts.init($('#main')[0],'myEssos');
		
		var option = {
		    title : {
		        x:'center'
		    },
		    tooltip : {
		        trigger: 'item',
		        formatter: "{a} <br/>{b} : {c} ({d}%)"
		    },
		    legend: {
		        orient: 'vertical',
		        left: 'left',
		        data: ['注册会员','VIP会员','机构会员'],
		    },
		    series : [
		        {
		            name: '访问来源',
		            type: 'pie',
		            radius : '55%',
		            radius: [0, '30%'],
		            center: ['50%', '60%'],
		            data:[
		                {value:335, name:'注册会员'},
		                {value:310, name:'VIP会员'},
		                {value:234, name:'机构会员'}
		            ],
		            itemStyle: {
		                emphasis: {
		                    shadowBlur: 10,
		                    shadowOffsetX: 0,
		                    shadowColor: 'rgba(0, 0, 0, 0.5)'
		                }
		            }
		        }
		    ]
		};
		myChart.setOption(option);
	</script>
</body>
</html>